<template>
	<div>
  <el-table
    :data="tableData"
    border
    style="width: 100%">
    <el-table-column
      fixed
      prop="eno"
      label="员工编号"
      width="150">
    </el-table-column>
    <el-table-column
      prop="ename"
      label="员工姓名"
      width="150">
    </el-table-column>
    <el-table-column
      prop="epassword"
      label="员工密码"
      width="100">
    </el-table-column>
    <el-table-column
      prop="elevel"
      label="员工级别"
      width="150">
    </el-table-column>
    <el-table-column
      prop="ephone"
      label="员工电话"
      width="120">
    </el-table-column>
    <el-table-column
      prop="esalary"
      label="员工工资"
      width="150">
    </el-table-column>
	<el-table-column
	  prop="eremark"
	  label="备注"
	  width="150">
	</el-table-column>
    <el-table-column
          fixed="right"
          label="操作"
          width="200">
          <template slot-scope="scope">
            <el-button @click="edit(scope.row)" type="text" size="small">修改</el-button>
            <el-button  @click="deleteemployee(scope.row)"type="text" size="small">删除</el-button>
          </template>
    </el-table-column>
  </el-table>
  <el-pagination
    background
    layout="prev, pager, next"
	page-size="5"
    :total="total"
	@current-change="page">
  </el-pagination>
  </div>
</template>

<script>
  export default {
	  name: "EmployeeSearch",
    methods: {
		deleteemployee(row){
			const _this = this
			axios.delete('http://localhost:8181/employee/deleteById/'+row.eno).then(function(resp){
					_this.$message('删除成功！');
					window.location.reload();				
			})
		},
		edit(row) {
		  this.$router.push({
					path:'/employeeupdate',
					query:{
						id:row.eno
					}
				})
		},

	  page(currentPage){
		  const _this = this
		  axios.get('http://localhost:8181/employee/findAll/'+currentPage+'/5').then(function(resp){
		  	_this.tableData = resp.data.content
		  	_this.total = resp.data.totalElements
		  })
	  }
    },
	
	created(){
		const _this = this
		axios.get('http://localhost:8181/employee/findAll/1/5').then(function(resp){
			_this.tableData = resp.data.content
			_this.total = resp.data.totalElements
		})
		
	},
    data() {
      return {
		  total: null,
        tableData: null
      }
    }
  }
</script>
